<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        const arr = ['a', 'b', 'c', 'd'];
        const mapping = {
            a: 1,
            b: 2,
            c: 3,
            d: 4,
        }

        // 第一题
        const expect = [1, 2, 3, 4];
        const res = [];
        for (const item of arr) {
            // const newItem = mapping['a'];
            const newItem = mapping[item];
            res.push(newItem);
        }
        console.log(res);

        const arr1 = arr.map((item) => mapping[item]);
        console.log(arr1);

        // 第二题
        const str = 'abcd';
        function mappping1 (letter) {
            switch (letter) {
            case 'a':
                return 1;
            case 'b':
                return 2;
            case 'c':
                return 3;
            case 'd':
                return 4;
            default:
                return null;
            }
        }
        const expect1 = '1234';
        let str1 = '';
        for (let i = 0; i < str.length; i++) {
            const letter = str[i];
            str1 += mappping1(letter);
        }
        console.log(str1);

        const arr2 = [1, 2, 3, 4];
        function map (arr, ruleFunc) {
            const result = [];
            for (const item of arr) {
                const newItem = ruleFunc(item);
                result.push(newItem);
            }
            return result;
        }
        function fn (item) {
            return item * 11;
        }
        const res2 = map (arr2, fn);
        console.log(res2);
    </script>
</body>
</html>